var CHOOSE_CONFIG = {
	TYPE:'CLOTHING',
    JQXGRID: '#jqxLinkGrid',
    BINDING_URI: base_url + 'cms/cp/product/bindingdata/',
};
var CHOOSE_PR = (function() {
    var datafields = [
        {name: 'product_id', type: 'int'},
        {name: 'product_title'},
        {name: 'product_thumb'},
		{name: 'product_category_id',type: 'int'},
        {name: 'product_position',type: 'int'},
        {name: 'product_status',type: 'bool'},
        {name: 'product_insert', type: 'date'},
        {name: 'product_update', type: 'date'},
    ];
    var source,dataAdapter,callbackwhendone;
    var oTable;
    var that = this;
    return {
        onOpenPopup:function(_callback){
			callbackwhendone= _callback;
			if($(CHOOSE_CONFIG.JQXGRID).length<=0){
				$('body').append('\
					<div id="choose_product_dialog" >\
						<div style="">\
							<div style="border:1px solid #ccc;border-bottom:0;position:relative">\
								<input id="jqxNewsSearchtxt" placeholder="Type to Search..." class="base_row" style="height:24px;margin:0;padding:0;border:0"/>\
								<div id="jqxNewsSearchbtn" style="position:absolute;right:0;top:0;height:100%;width:60px;line-height:24px;text-align:center;font-weight:bold">Search</div>\
							</div>\
							<div id="jqxLinkGrid" style="width:480px"></div>\
						</div>\
					</div>');
				bckdialog({
					title:'PRODUCT',
					message:$('#choose_product_dialog'),
					buttons: [
						
						/*{
							text    :'Done',
							class   :'base_button base_green base-small-border-radius',
							click   : function() {
								$(this).dialog("close");
								if (typeof(_callback) === 'function'){
                                    _callback(_e,CHOOSE_PR.getProductIndex());
									
								}
							}
						},*/
						{
							text    :'Close',
							class   :'base_button base_red base-small-border-radius',
							click   : function() {
								$(this).dialog("close");
							}
						}
					]
				}).open();
				CHOOSE_PR.creategrid();
			}else{
				
				$('#choose_product_dialog').dialog("open");
			}
			
		},
		getProductIndex:function(_row){
			if(_row===undefined) _row = $(CHOOSE_CONFIG.JQXGRID).jqxGrid('getselectedrowindex');
			var _data = $(CHOOSE_CONFIG.JQXGRID).jqxGrid('getrowdata', _row);
			return _data;
		},
        creategrid  :   function(){
            source = {
                datatype: "json", type: "POST",
                datafields: datafields,
                url: CHOOSE_CONFIG.BINDING_URI+CHOOSE_CONFIG.TYPE,
				filter: function() {
                    $(CHOOSE_CONFIG.JQXGRID).jqxGrid('updatebounddata', 'filter');
                },
                sort: function() {
                    $(CHOOSE_CONFIG.JQXGRID).jqxGrid('updatebounddata');
                },
                id:'product_id',
                root: 'rows',
            };
            dataAdapter = new $.jqx.dataAdapter(source, {
				beforeSend: function (xhr) {
					$('#jqxNewsSearchbtn').off('click');
				},
				loadComplete: function () {
					$('#jqxNewsSearchbtn').on('click',function(){
						CHOOSE_PR.onFillter('product_title',$('#jqxNewsSearchtxt').val());
					});
					$('#jqxNewsSearchtxt').focus()
				},
                loadError: function(xhr, status, error) {
                    bckdialog({type: 'error'}).open("<b>Status</b>:" + xhr.status + "<br/><b>ThrownError</b>:" + error + "<br/>", 'Error Message!');
                }
            });
            var columns = [
                {
                    text: 'TITLE'       , dataField: 'product_title',
					cellsrenderer: function (row, columnfield, value, defaulthtml, columnproperties) {
						var _data = $(jqxLinkGrid).jqxGrid('getrowdata', row);
						
						
						
						var str = '<div class="rnode" style="overflow: hidden; text-overflow: ellipsis;text-align: left;line-height:24px;padding-left:2px">';
						str+='<img style="left:0;top:0;margin-right:4px" onError="this.src = \'/libraries/images/22/picture.png\'" class="cellthumb" height="32" src="' + (_data.product_thumb) + '"/><b>'+value+'</b>';
						str+='</div>';
						return str;
					}
                }
				,{ 
					text: '', datafield: 'product_id', columntype: 'button',width:60, 
					cellsrenderer: function () {
						 return "Choose";
				  }, buttonclick: function (row) {
						 // open the popup window when the user clicks a button.
						var dataRecord = $(CHOOSE_CONFIG.JQXGRID).jqxGrid('getrowdata', row);
						if (typeof(callbackwhendone) === 'function'){
							callbackwhendone(dataRecord);
						}
						$('#choose_product_dialog').dialog("close");
					 }
                 }
            ];
            $(CHOOSE_CONFIG.JQXGRID).jqxGrid({
                width: '480px', //autoheight:true,
                height: '320px',
                source: dataAdapter,
                theme: theme, sortable: true,
                //rowsheight:34,
                showemptyrow: true,
                columns: columns,
                virtualmode: true,
                //groupable: true,
                rendergridrows: function(){ return dataAdapter.records; },
                pageable: true,
                pagesize: 100,
                pagesizeoptions: ['100', '200', '500', '1000'],
                ready: function() {
                    var $refresh = $('<div type="button"  title="Refresh" style="margin-left: 0px;padding:0 4px; float: left; cursor: pointer;height:15px;"><img src="/libraries/images/16/view_refresh.png"/></div>');
                    var $option = $('<div type="button"  title="Option" style="margin-left: 0px;padding:0 4px; float: left; cursor: pointer;height:15px;"><img src="/libraries/images/16/option.gif"/></div>');
                    $refresh.click(function(){
                        CHOOSE_PR.onRefresh();
                    });
                    $option.prependTo($(CHOOSE_CONFIG.JQXGRID+' .jqx-grid-pager>div'));
                    $refresh.prependTo($(CHOOSE_CONFIG.JQXGRID+' .jqx-grid-pager>div'));
                    $('#choose_product_dialog').dialog("close").dialog("open");
                    $("#jqxNewsSearchtxt").keyup(function(event){
						if(event.keyCode == 13){
							$("#jqxNewsSearchbtn").click();
						}
					});
                }

            });
        },
        onInit  :   function(){
            CHOOSE_PR.creategrid();
            
        },
        onRefresh:function(){
            //oTable.fnDraw(false);
            $(CHOOSE_CONFIG.JQXGRID).jqxGrid('updatebounddata');
        },
		onFillter: function(datafield, filtervalue) {
            if (filtervalue == '') {
                $(CHOOSE_CONFIG.JQXGRID).jqxGrid('removefilter', datafield, true);
                return;
            }
            var filtertype = 'stringfilter';
            var filtergroup = new $.jqx.filter();
            var filter_or_operator = 1;
            var filtercondition = 'contains';
            var filter = filtergroup.createfilter(filtertype, filtervalue, filtercondition);
            filtergroup.addfilter(filter_or_operator, filter);

            //$(grid_element).jqxGrid('clearfilters');
            // add the filters.
            $(CHOOSE_CONFIG.JQXGRID).jqxGrid('addfilter', datafield, filtergroup);
            // apply the filters.
            $(CHOOSE_CONFIG.JQXGRID).jqxGrid('applyfilters');
        },
    };
}());
